<template>
    <div class="footer">
        <div class="check">
            <input type="checkbox">全选
        </div>
       <div class="settlement">
        合计：(商品价格)
        <button class="settlementbox">结算()</button>
       </div>
    </div>
</template>

<script>
export default {
    name: 'carFooter',
    data() {
        return {

        };
    }
    //注册组件
}



</script>

<style scoped>
.footer {
    display: flex; /* 使用Flexbox布局 */
    justify-content: space-between; /* 子元素间隔均匀分布 */
    align-items: center; /* 垂直居中对齐子元素 */
    position: fixed;
    bottom: 0; /* 底部固定 */
    left: 0; /* 左边对齐 */
    height: 70px;
    background-color: rgb(248, 245, 245);
    width: 100%;
    padding: 0 10px; /* 根据需要调节，为内部元素提供一些空间 */
}

.check {
    /* 移除浮动属性 */
}

.settlement {
    /* 移除浮动属性 */
    display: flex; /* 使用Flexbox布局 */
    align-items: center; /* 垂直居中对齐子元素 */
}

.settlementbox {
    background-color: rgb(235, 24, 67);
    color: white;
    height: 70px;
    width: 100px;
    font-size: 20px;
    border: none; /* 移除边框 */
    cursor: pointer; /* 鼠标悬停时显示指针 */
}
</style>